<template>
	<view class="wrap" :class='APPTheme'>
		<view class="top"></view>
		<view class="content">
			<view class="title">欢迎登录量子办公助手</view>
			<view class="input-title">登录名：</view>
			<input class="u-border-bottom" type="text" v-model="login.loginName" placeholder="请输入登录名" />
			<view class="input-title">密码：</view>
			<view class="lz-column">
				<input class="u-border-bottom" :password="show.password" v-model="login.password" placeholder="请输入密码" />
				<uni-icons type="eye-filled" size="22" @click="show.password=!show.password" :color="show.password?'#888':'#00aa7f'"></uni-icons>
			</view>
			<view class="input-title" v-if="imageUrl">验证码：</view>
			<view class="input-line" v-if="imageUrl">
				<input class="u-border-bottom" type="text" v-model="login.code" placeholder="请输入验证码" />
				<image class="image" :src="imageUrl" @click="RefreshImage"></image>
			</view>
			<checkbox-group @change="passwordChangefn">
				<label class="checkbox">
					<checkbox value="记住密码" :checked="password_onoff" style="transform: scale(0.7);"/>
					<text style="color: #888;">记住密码</text>
				</label>
			</checkbox-group>
			<wButton text="登 录" :rotate="login.isRotate"  bgColor="linear-gradient(to right, rgba(10,177,87,0.7), rgba(50,135,200,0.6))" @click.native="submit()" class="getCaptcha"></wButton>
			
			<view class="alternative">
				<view class="password" @click="SMSLogin">短信验证码登录</view>
				<view class="issue" @click="forgetPassword">忘记密码</view>
			</view>
		</view>
		<view class="hint">
			
		</view>
		
		<view class="buttom">
			<!-- <view class="loginType">
				<view class="wechat item">
					<view class="icon"><uni-icons size="40" type="weixin" color="rgb(83,194,64)"></uni-icons></view>
					微信
				</view>
				<view class="QQ item">
					<view class="icon"><uni-icons size="40" type="qq" color="rgb(17,183,233)"></uni-icons></view>
					QQ
				</view>
			</view> -->
			<view class="hint">
				<checkbox-group @change="checkboxChange">
					<label class="checkbox">
						<checkbox value="用户协议" :checked="user_agreement" />
						登陆即代表阅读并同意
						<navigator url="../agreement/agreement" style="display: inline-block;"><text class="link">用户隐私声明</text></navigator>
					</label>
				</checkbox-group>
			</view>
		</view>
	</view>
</template>

<script>
let that
import {mapGetters,mapActions} from 'vuex';
// import JSEncrypt from 'jsencrypt';//rsa加密
import wButton from '@/components/watch-login/watch-button.vue' //button
export default {
	components:{
		wButton
	},
	data() {
		return {
			password_onoff:false,//是否记住密码
			user_agreement:true,//用户隐私声明
			login:{
				loginName: '',
				password:'',
				sessionId:'',
				code:'',//验证码
				isRotate: false, //是否加载旋转
			},
			show:{
				password:true
			},
			imageUrl:''
			
		}
	},
	computed: {
		...mapGetters(['APPTheme','userInfo','api','rememberPassword']),
	},
	onLoad() {
		that=this
		//判断是否记住密码
		that.isRememberPassword()
	},
	methods: {
		...mapActions(['set_userInfo','set_userToken','set_rememberPassword','remove_rememberPassword']),
		//判断是否记住密码
		isRememberPassword(){
			if(that.rememberPassword){
				that.password_onoff=true
				console.log(that.rememberPassword);
				that.login=that.rememberPassword
			}else{
				that.password_onoff=false
			}
		},
		//刷新验证码
		RefreshImage(){
			that.imageUrl=''
			that.$nextTick(function(){
				that.imageUrl=that.GLOBAL.host_svr+that.api.GLOBAL_defaultKaptcha+that.login.sessionId
			})
		},
		async submit() {
			if(that.login.loginName) {
				if(!that.login.password){
					uni.showToast({
						title: '请填写密码',
						icon:"none"
					});
					return
				}
				if(!that.user_agreement){
					uni.showToast({
						title: '请勾选用户协议',
						icon:"none"
					});
					return
				}
				that.login.isRotate=true
				console.log(that.login);
				that.GLOBAL.doPost(that.api.GLOBAL_login,that.login).then(res=>{
					if(res.code=='200'){
						//存储userToken
						that.set_userToken(res.data.token)
						//存储用户信息
						that.set_userInfo(res.data)
						uni.showToast({
							title: res.msg,
							icon:'none',
							success() {
								that.login.isRotate=false
								//获取国科量子参数
								//#ifdef APP-PLUS
								that.gkQSS()
								//#endif
								//判断是否要记住密码
								if(that.password_onoff){
									that.set_rememberPassword(that.login)
									uni.setStorageSync('userInfo_password_name',that.login)//给启动图页面设置每次量子初始化
								}else{
									that.remove_rememberPassword('')
								}
								
								uni.$emit('start_up_heartBeat')//启动心跳
								uni.switchTab({
									url: '/pages/tabbar/index',
									success: res => {},
									fail: () => {},
									complete: () => {}
								});
								
							}
						});
					}else{
						that.login.isRotate=false
						that.login.sessionId=res.data.sessionId
						uni.showToast({
							title: res.msg,
							icon:'none'
						});
						if(res.data.boolShow){
							that.imageUrl=''
							that.login.code=''
							that.$nextTick(function(){
								that.imageUrl=that.GLOBAL.host_svr+that.api.GLOBAL_defaultKaptcha+res.data.sessionId
							})
						}else{
							that.imageUrl=''
							that.login.code=''
						}
						
					}
				}).catch(error=>{
					that.login.sessionId=''
					uni.showToast({
						title: JSON.stringify(error),
						icon:"none"
					});
					that.login.isRotate=false
				})
			}else{
				if(that.login.loginName){
					uni.showToast({
						title: '手机格式不正确',
						icon:"none"
					});
				}else{
					uni.showToast({
						title: '请填写手机号码',
						icon:"none"
					});
				}
				
			}
		},
		//获取国科量子参数
		gkQSS(){
			that.GLOBAL.doGet(that.api.GLOBAL_rest_chat_encryption_initKey,{keyIndex:that.login.loginName}).then(res=>{
				if(res.code=='00'){
					let qss=res.data
					that.$lizhao.QSS.initQSS(qss.pubkey,qss.prvkey,qss.kek,qss.zmk)
				}
				
			});
		},
		checkboxChange(e) {
			console.log(e.detail.value);
			if (e.detail.value[0] == '用户协议') {
				that.user_agreement = true;
			} else {
				that.user_agreement = false;
			}
		},
		//短信登陆
		SMSLogin(){
			uni.navigateTo({
				url: './login',
				success: res => {},
				fail: () => {},
				complete: () => {}
			});
		},
		//记住密码
		passwordChangefn(e){
			console.log(e.detail.value[0]);
			if(e.detail.value[0]=='记住密码'){
				that.password_onoff=true
			}else{
				that.password_onoff=false
			}
		},
		//忘记密码
		forgetPassword(){
			uni.navigateTo({
				url: '../forgetPassword/forgetPassword',
				success: res => {},
				fail: () => {},
				complete: () => {}
			});
		}
	}
};
</script>

<style lang="scss" scoped>
@import './login.scss';

</style>
